<template>
	<view>
		<view class="head">
			<dsl-navbar title="心动女生规则" textTitle="white" backBg="white" isBack=""></dsl-navbar>
		</view>
		<view style="margin-top: -280rpx;">
			<view class="padding">
				<view class="head_title">成为心动女生你将获得：</view>
			</view>
			<view class="rule_body padding">
				<view class="text-center">
					<image src="/static/plugins/share/imgjiangli.png" mode="widthFix" style="width: 150rpx;"></image>
					<view class="text-bold text-lg margin-top">提高奖励</view>
				</view>
				<view class="rule_content margin-tb">
					每次通话产生时长热度分，时长超过1分钟后，每分钟
					增加1热度分，每次通话时长最多增加6O热度分
				</view>
				<view class="text-center">
					<image src="/static/share/imgbiaoshi.png" mode="widthFix" style="width: 150rpx;"></image>
					<view class="text-bold text-lg margin-top">专属标识</view>
				</view>
				<view class="rule_content margin-tb ">
					每次通话产生时长热度分，时长超过1分钟后，每分钟
					增加1热度分，每次通话时长最多增加6O热度分
				</view>
			</view>
		</view>
		<view class="rule_body padding">
			<view class="text-xl text-bold">
				如何成为心动女生？
			</view>
			<view class="flex margin-top">
				<view class="round"></view>
				<view class="margin-left-sm" style="color: #9AA2B5;">每次求抢聊通话获得的评价值，对应增加热度分，详见下表;</view>
			</view>
			<view class="flex margin-top">
				<view class="round"></view>
				<view class="margin-left-sm" style="color: #9AA2B5;">每次回拨通话增加3热度分;</view>
			</view>
			<view class="flex margin-top">
				<view>
					<view class="round"></view>
				</view>
				<view class="margin-left-sm" style="color: #9AA2B5;">每次通话产生时长热度分，时长超过1分钟后，每分钟增加1热度分，每次通话时长最多增加6O热度分;
				</view>
			</view>
		</view>
		<view class="rule_body padding">
			<view class="text-xl text-bold">
				费用
			</view>
			<view class="margin-top" style="color: #9AA2B5;">每次求抢聊通话获得的评价值，对应增加热度分，详见下表;</view>
		</view>
		<view class="rule_body padding">
			<view class="text-xl text-bold">
				注意事项
			</view>
			<view class="flex margin-top">
				<view class="round"></view>
				<view class="margin-left-sm" style="color: #9AA2B5;">每次求抢聊通话获得的评价值，对应增加热度分，详
见下表;</view>
			</view>
			<view class="flex margin-top">
				<view class="round"></view>
				<view class="margin-left-sm" style="color: #9AA2B5;">每次回拨通话增加3热度分;</view>
			</view>
			<view class="flex margin-top">
				<view>
					<view class="round"></view>
				</view>
				<view class="margin-left-sm" style="color: #9AA2B5;">每次通话产生时长热度分，时长超过1分钟后，每分钟增加1热度分，每次通话时长最多增加6O热度分;
				</view>
			</view>
		</view>
		<view class="sample text-center padding">
			<view style="color:#BA4949 ;font-size: 30rpx;" class="text-bold">收费示例</view>
			<view class="text-white margin">
				每次通话产生时长热度分，时长超过1分钟后，每分
				钟增加1热度分，每次通话时长最多增加6O热度......
			</view>
		</view>
		<view class="message_body text-center">
			<view class="rowsb ">
				<view class="table">4.2-4.6分</view>
				<view class="table">1.6元/分钟</view>
			</view>
			<view class="rowsb ">
				<view class="table">3.8分-4.1分</view>
				<view class="table">1.2元/分钟</view>
			</view>
			<view class="rowsb ">
				<view class="table">3.3-3.7分</view>
				<view class="table">1元/分钟</view>
			</view>
			<view class="rowsb ">
				<view class="table">2.8-3.2分</view>
				<view class="table">0.6元/分钟</view>
			</view>
			<view class="rowsb ">
				<view class="table"><=2.7分</view>
				<view class="table">无奖励</view>
			</view>
		</view>
	</view>
</template>

<script>
</script>

<style lang="scss">
	page {
		background-color: #F7F6FA;
	}

	//头部
	.head {
		width: 750rpx;
		height: 440rpx;
		background: #EAA019;
		opacity: 1;
	}

	.head_title {
		font-size: 30rpx;
		font-family: PingFang SC;
		font-weight: bold;
		color: #BA4949;
		opacity: 1;
	}

	//内容
	.rule_body {
		width: 710rpx;
		background: #FFFFFF;
		opacity: 1;
		border-radius: 20rpx;
		margin: 0 auto;
		margin-bottom: 20rpx;
	}

	.rule_content {
		font-size: 28rpx;
		font-family: PingFang SC;
		font-weight: 400;
		color: #9AA2B5;
		opacity: 1;
	}

	.round {
		background-color: #EAA019;
		height: 15rpx;
		width: 15rpx;
	}
	
	//示例
	.sample{
		width: 710rpx;
		background: #EDB249;
		border-radius: 18rpx 18rpx 0px 0px;
		margin: 0 auto;
	}
	.message_body{
		width: 710rpx;
		background: #FFFFFF;
		box-shadow: 0px 3rpx 6rpx rgba(0, 0, 0, 0.16);
		margin: 0 auto;
		border-radius:  0px 0px 18rpx 18rpx;
	}
	.table{
		width: 50%;height: 100rpx;line-height: 100rpx; border: 1rpx solid #F7F6FA;
	}
</style>
